{#- THE STORY OF A CHAPTER, as markup (#54, #55, #56). Rendered by the app page (chapter.html,
    `edit` true: the writing forms, photos served by /media) and inside the keepsake file
    (keepsake_inner.html, `edit` false, `imgs` = {media id: data: URI}). ONE partial, so the
    page and the file can never tell two different stories.
    Needs in context: s (story.build), edit (bool), imgs (dict or none). -#}
{% import "_chart.html" as ch %}
{% set c = s.chapter %}{% set sm = s.summary %}
{% macro note(n, tok, edit) %}
<aside class="story-note" id="n-{{ n.id }}">
  <cite>looking back{% if n.about %} · about {{ n.about }}{% endif %} · written {{ n.created_at|local('%b %-d, %Y') }}{% if n.updated_at - n.created_at > 60 %} · revised {{ n.updated_at|local('%b %-d') }}{% endif %}{% if n.author == 'ai' %} · by the Handler{% endif %}</cite>
  <p>{{ n.body }}</p>
  {% if edit %}<details class="story-edit">
    <summary class="hint">edit</summary>
    <form method="post" action="/chapters/{{ s.chapter.id }}/notes/{{ n.id }}/edit">
      <input type="hidden" name="_t" value="{{ tok }}">
      <textarea name="body" rows="3" maxlength="20000" required>{{ n.body }}</textarea>
      <p class="row"><button class="btn">Save</button></p>
    </form>
    <form method="post" action="/chapters/{{ s.chapter.id }}/notes/{{ n.id }}/delete">
      <input type="hidden" name="_t" value="{{ tok }}"><button class="btn danger">Remove this note</button>
    </form>
  </details>{% endif %}
</aside>
{% endmacro %}
<article class="story">
<header class="story-hero{{ ' has-cover' if s.cover }}">
  {% if s.cover %}<img class="story-cover" src="{{ imgs[s.cover.id] if imgs else '/media/' ~ s.cover.id }}" alt="">{% endif %}
  <div class="story-title">
    <p class="eyebrow">📖 a chapter{{ " · shared" if s.shared }}</p>
    <h1>{{ c.title }}</h1>
    <p class="story-when">{{ s.lo|local('%B %-d, %Y') }} — {{ s.last_day_ts|local('%B %-d, %Y') if not s.open else 'still being written' }}
      · {{ sm.days }} day{{ 's' if sm.days != 1 }}</p>
  </div>
</header>

{#- 🔴 one token for every edit form on the page: they are all "chapters.edit" -#}
{% set tok = form_token('chapters.edit') if edit else '' %}
{% if c.foreword or edit %}<section class="card foreword" id="foreword">
  {% if c.foreword %}<p>{{ c.foreword }}</p>{% endif %}
  {% if edit %}<details class="story-edit"{% if not c.foreword %} open{% endif %}>
    <summary class="hint">✍️ {{ 'edit the foreword' if c.foreword else 'write a foreword — what this chapter was, in your words now' }}</summary>
    <form method="post" action="/chapters/{{ c.id }}/foreword">
      <input type="hidden" name="_t" value="{{ tok }}">
      <textarea name="foreword" rows="4" maxlength="20000" placeholder="Looking back on it…">{{ c.foreword }}</textarea>
      <p class="row"><button class="btn primary">Save</button>{% if c.foreword %}<span class="hint">empty it and save to remove it</span>{% endif %}</p>
    </form>
  </details>{% endif %}
</section>{% endif %}
{#- 🎯 THE GOAL (M10 #60): the pup's want and the verdict core/quest.py reached. Absent from the
    shareable edition (story.build_shareable names no `goal`), so `s.goal` is simply missing there. -#}
{% if s.goal or edit %}<section class="card goal" id="goal">
  {% if s.goal %}
  <p class="eyebrow">🎯 the goal{% if s.goal.verdict %} · <b>{{ {'met': 'reached', 'missed': 'not reached', 'open': 'still open', 'unmeasured': 'not measured'}[s.goal.verdict] }}</b>{% endif %}</p>
  {% if s.goal.text %}<p class="goal-want">{{ s.goal.text }}</p>{% endif %}
  <p class="hint">{{ s.goal.label }}{% if s.goal.days %} · day {{ s.goal.day }} of {{ s.goal.days }}{% endif %}</p>
  {% endif %}
  {% if edit %}<details class="story-edit"{% if not s.goal %} open{% endif %}>
    <summary class="hint">🎯 {{ 'change the goal' if s.goal else 'set a goal — what this chapter is for, and how the log should measure it' }}</summary>
    <form method="post" action="/chapters/{{ c.id }}/goal" class="row">
      <input type="hidden" name="_t" value="{{ tok }}">
      <input name="text" maxlength="200" placeholder="four days of guitar a week" value="{{ c.goal }}">
      <select name="measure">
        <option value="">words only — said, not measured</option>
        {% for a in habit_options or [] %}<option value="habit:{{ a.slug }}"{% if c.goal_kind == 'habit' and c.goal_ref == a.slug %} selected{% endif %}>{{ a.icon }} {{ a.title }} — on its target ({{ a.target_n }}/week), every week</option>{% endfor %}
        <option value="locked_days"{% if c.goal_kind == 'locked_days' %} selected{% endif %}>days locked</option>
        <option value="reflect_days"{% if c.goal_kind == 'reflect_days' %} selected{% endif %}>days with a reflection</option>
      </select>
      <label>n <input type="number" name="n" min="0" max="366" value="{{ c.goal_n }}" title="days wanted — or, for a habit, weeks on target wanted (0 = every full week)"></label>
      <button class="btn primary">Save</button>
    </form>
    <p class="hint">A habit goal is held to the habit's own weekly target — change that on Habits, not here. <b>n</b> is the days wanted, or for a habit the weeks on target wanted (0 = every full week). Empty the words and pick “words only” to remove the goal.</p>
  </details>{% endif %}
</section>{% endif %}
{% if s.photos and edit %}
<details class="card story-edit" id="cover">
  <summary class="hint">🖼 choose the cover photo</summary>
  <form method="post" action="/chapters/{{ c.id }}/cover" class="cover-pick">
    <input type="hidden" name="_t" value="{{ tok }}">
    {% for p in s.photos %}
    <label><input type="radio" name="media_id" value="{{ p.id }}"{% if c.cover_media_id == p.id %} checked{% endif %}><img src="/media/{{ p.id }}/thumb" alt="{{ p.caption or '' }}" loading="lazy"></label>
    {% endfor %}
    <label class="cover-none"><input type="radio" name="media_id" value=""{% if not c.cover_media_id %} checked{% endif %}><span>the first photo</span></label>
    <p class="row"><button class="btn primary">Use this cover</button></p>
  </form>
</details>
{% endif %}

<section class="tiles story-tiles">
  <div class="tile"><b>{{ sm.locked_seconds|dur }}</b><span>locked, in all</span></div>
  {% if sm.longest_seconds %}<div class="tile"><b>{{ sm.longest_seconds|dur }}</b><span>longest stretch</span></div>{% endif %}
  <div class="tile"><b>{{ sm.active_days }}</b><span>of {{ sm.days }} days with something in them</span></div>
  {% if sm.reflections or sm.checkins %}<div class="tile"><b>{{ sm.reflections }}</b><span>reflection{{ 's' if sm.reflections != 1 }} · {{ sm.checkins }} check-in{{ 's' if sm.checkins != 1 }}</span></div>{% endif %}
  {% if sm.tasks_done %}<div class="tile"><b>{{ sm.tasks_done }}</b><span>task{{ 's' if sm.tasks_done != 1 }} done</span></div>{% endif %}
  {% if sm.photos %}<div class="tile"><b>{{ sm.photos }}</b><span>photo{{ 's' if sm.photos != 1 }}</span></div>{% endif %}
  {% if sm.badges %}<div class="tile"><b>{{ sm.badges }}</b><span>badge{{ 's' if sm.badges != 1 }} earned</span></div>{% endif %}
</section>
{% if sm.most_locked or sm.best_headspace %}
<p class="hint story-best">
  {% if sm.most_locked %}Most locked: <a href="#d-{{ sm.most_locked.day }}">{{ sm.most_locked.day|isodate('%A %b %-d') }}</a> ({{ sm.most_locked.active_seconds|dur }}).{% endif %}
  {% if sm.best_headspace %}Best headspace: <a href="#d-{{ sm.best_headspace.day }}">{{ sm.best_headspace.day|isodate('%A %b %-d') }}</a> ({{ '%.1f'|format(sm.best_headspace.value) }}).{% endif %}
</p>
{% endif %}

<section class="grid2">
  {{ ch.panel("🔒 " ~ s.trends.hours.title, ch.bar(s.trends.hours, "the last bar is today, so far" if s.open else "")) }}
  {% if s.trends.scores %}{{ ch.panel("🧭 " ~ s.trends.scores.title, ch.line(s.trends.scores, "a gap is a day with no check-in")) }}{% endif %}
</section>

<section class="story-days">
{% for it in s.days %}
  {% if it.quiet %}
  <p class="story-quiet">· quiet for {{ it.n }} day{{ 's' if it.n != 1 }}{% if it.n > 1 %} — {{ it.first|isodate('%b %-d') }} to {{ it.last|isodate('%b %-d') }}{% endif %} ·</p>
  {% else %}
  <section class="card story-day" id="d-{{ it.day }}">
    <h3><span class="dayno">Day {{ it.n }}</span> {{ it.day|isodate('%A, %B %-d') }}</h3>
    {% if it.sentence %}<p class="story-line">{{ it.sentence }}</p>{% endif %}
    {% if it.scores %}<p class="story-scores">{% for k, v in it.scores.items() %}<span class="score-pill sc-{{ k }}">{{ k }} {{ '%.0f'|format(v) if v == v|int else '%.1f'|format(v) }}</span>{% endfor %}</p>{% endif %}
    {% if it.moments or it.badges %}<ul class="story-moments">
      {% for m in it.moments %}<li><span>{{ m.icon }}</span> {{ m.text }} <small class="hint">{{ m.ts|local('%H:%M') }}</small></li>{% endfor %}
      {% for b in it.badges %}<li><span>{{ b.icon or '🏅' }}</span> Earned <b>{{ b.title }}</b>{% if b.detail %} — {{ b.detail }}{% endif %}</li>{% endfor %}
    </ul>{% endif %}
    {% for e in it.entries %}
    <blockquote class="story-entry kind-{{ e.kind }}">
      <cite>{{ {'reflection': '📓 reflection', 'checkin': '🧭 check-in', 'confession': '🙊 confession', 'catchup': '🗒 caught up'}[e.kind] }} · {{ e.ts|local('%H:%M') }}</cite>
      {% if e.prompt_text %}<p class="story-prompt">{{ e.prompt_text }}</p>{% endif %}
      {% if e.body %}<p>{{ e.body }}</p>{% endif %}
    </blockquote>
    {% endfor %}
    {% if it.photos %}<div class="story-photos">
      {% for p in it.photos %}{% if imgs %}{% if imgs[p.id] %}<img src="{{ imgs[p.id] }}" alt="{{ p.caption or '' }}">{% endif %}{% else %}<a href="/media/{{ p.id }}" target="_blank" rel="noopener"><img src="/media/{{ p.id }}/thumb" alt="{{ p.caption or '' }}" loading="lazy"></a>{% endif %}{% endfor %}
    </div>{% endif %}
    {% for n in it.notes %}{{ note(n, tok, edit) }}{% endfor %}
    {% if edit %}<details class="story-edit add-note">
      <summary class="hint">✍️ add a note about this day</summary>
      <form method="post" action="/chapters/{{ c.id }}/notes">
        <input type="hidden" name="_t" value="{{ tok }}"><input type="hidden" name="day" value="{{ it.day }}">
        {% if it.targets %}<label>about <select name="about">
          <option value="day">the whole day</option>
          {% for k, i, lab in it.targets %}<option value="{{ k }}:{{ i }}">{{ lab }}</option>{% endfor %}
        </select></label>{% endif %}
        <textarea name="body" rows="3" maxlength="20000" required placeholder="Looking back on this day…"></textarea>
        <p class="row"><button class="btn primary">Keep this note</button></p>
      </form>
    </details>{% endif %}
  </section>
  {% endif %}
{% else %}
  <p class="hint">Nothing happened in this window yet.</p>
{% endfor %}
</section>

{% if s.notes_undated %}
<section class="card"><h3>Notes</h3><p class="hint">Written about days this chapter has not reached yet, or that arrived from another box.</p>
  {% for n in s.notes_undated %}<p class="hint">{{ n.day|isodate('%A, %B %-d') }}</p>{{ note(n, tok, edit) }}{% endfor %}
</section>
{% endif %}
{% if edit %}<details class="card story-edit" id="any-day">
  <summary class="hint">✍️ add a note about any day in this chapter — a quiet one too</summary>
  <form method="post" action="/chapters/{{ c.id }}/notes" class="row">
    <input type="hidden" name="_t" value="{{ tok }}"><input type="hidden" name="about" value="day">
    <label>day <input type="date" name="day" min="{{ s.first_day }}" max="{{ s.last_day }}" required></label>
    <textarea name="body" rows="3" maxlength="20000" required placeholder="What you remember about it…"></textarea>
    <button class="btn primary">Keep this note</button>
  </form>
</details>
{% include "_keepsake_form.html" %}
{% endif %}

<footer class="hint story-foot">
  {% if s.open %}As of {{ s.asof|local('%b %-d, %Y %H:%M') }} — this chapter is still open and grows until it ends.{% else %}Complete — as of the end of {{ s.last_day_ts|local('%b %-d, %Y') }}.{% endif %}
  {% if edit %}<a href="/timeline?chapter={{ c.id }}">See every event in the Log</a> ·
  <a href="/export/bundle.zip?chapter={{ c.id }}" download>⬇ export this chapter</a> ·
  <a href="/chapters">All chapters</a>{% else %}{{ keepsake_foot|safe if keepsake_foot }}{% endif %}
</footer>
</article>